.el-breadcrumb__inner,
.el-breadcrumb__inner a {
    font-weight: 400 !important;
}

.el-upload {
    input[type="file"] {
        display: none !important;
    }
}

.el-upload__input {
    display: none;
}

.upload-container {
    .el-upload {
        width: 100%;

        .el-upload-dragger {
            width: 100%;
            height: 200px;
        }
    }
}

.el-dropdown-menu {
    padding: 0 !important;
}

.el-range-separator {
    box-sizing: content-box;
}

.is-dark {
    z-index: 9999 !important;
}

/* 重置 el-button 中 icon 的 margin */
.reset-margin [class*="el-icon"]+span {
    margin-left: 2px !important;
}

/* 自定义 popover 的类名 */
.pure-popper {
    padding: 0 !important;
}

/* 自定义 tooltip 的类名 */
.pure-tooltip {
    // 右侧操作面板right-panel类名的z-index为40000，tooltip需要大于它才能显示
    z-index: 41000 !important;
}

/* nprogress 适配 element-plus 的主题色 */
#nprogress {
    & .bar {
        background-color: var(--el-color-primary) !important;
    }

    & .peg {
        box-shadow: 0 0 10px var(--el-color-primary),
            0 0 5px var(--el-color-primary) !important;
    }

    & .spinner-icon {
        border-top-color: var(--el-color-primary);
        border-left-color: var(--el-color-primary);
    }
}

/* 全局覆盖element-plus的el-dialog、el-drawer、el-message-box、el-notification组件右上角关闭图标的样式，表现更鲜明 */
.el-dialog__headerbtn,
.el-message-box__headerbtn {
    &:hover {
        .el-dialog__close {
            color: var(--el-color-info) !important;
        }
    }
}

.el-loading-mask {
    z-index: 50 !important;
}

.el-icon {

    &.el-dialog__close,
    &.el-drawer__close,
    &.el-message-box__close,
    &.el-notification__closeBtn {
        width: 24px;
        height: 24px;
        outline: none;
        border-radius: 4px;
        transition: background-color 0.2s, color 0.2s;

        &:hover {
            color: rgba(0, 0, 0, 0.88) !important;
            background-color: rgba(0, 0, 0, 0.06);
            text-decoration: none;
        }
    }
}

/* 克隆并自定义 ElMessage 样式，不会影响 ElMessage 原本样式，在 src/utils/message.ts 中调用自定义样式 ElMessage 方法即可，暗黑模式在 src/style/dark.scss 文件进行了适配 */
.pure-message {
    border-width: 0 !important;
    background: #fff !important;
    padding: 10px 13px !important;
    box-shadow: 0 3px 6px -4px #0000001f, 0 6px 16px #00000014,
        0 9px 28px 8px #0000000d !important;

    &.el-message.is-closable .el-message__content {
        padding-right: 17px !important;
    }

    & .el-message__content {
        color: #000000d9 !important;
        pointer-events: all !important;
        background-image: initial !important;
    }

    & .el-message__icon {
        margin-right: 8px !important;
    }

    & .el-message__closeBtn {
        outline: none;
        border-radius: 4px;
        right: 9px !important;
        transition: background-color 0.2s, color 0.2s;

        &:hover {
            background-color: rgba(0, 0, 0, 0.06);
        }
    }
}

//底部居中按钮
.dialog-footer {
    margin: 0 auto;
    display: block;
    text-align: center;
}

// TODO:教师端

.h100-60 {
    height: calc(100% - 60px);

    .pure-table {
        height: calc(100% - 60px);

        .el-table--fit {
            height: calc(100% - 35px);
        }
    }
}

.th100 {
    height: 100%;

    .pure-table {
        height: calc(100% - 60px);

        .el-table--fit {
            height: calc(100% - 60px);
        }
    }
}

@media screen and (max-height: 1600px) {
    .h100-60 {
        height: calc(100% - 60px);

        .pure-table {
            height: calc(100% - 90px);

            .el-table--fit {
                height: calc(100% - 35px);
            }
        }
    }
}